<template>
  <div class="manage-dashboard-main-workspace-content">
    <div class="fc-manage-dashboard-horizontal-navigation"></div>
    <div class="account-settings">
      <div class="setting-common-card-container ">
        <div class="setting-common-card-container-title">账户信息</div>
        <div class="setting-common-card-container-content horizontal">
          <div class="setting-common-card-container-content-item">
            <div class="item-name-zone"><span class="desc-name">状态</span></div>
            <div class="item-value-zone"><span class="account-settings-accountinfo-status-warning">余额为{{userInfo.balance}}</span></div>
          </div>
          <div class="setting-common-card-container-content-item">
            <div class="item-name-zone"><span class="desc-name">预算</span></div>
            <div class="item-value-zone">不限定预算</div>
            <button type="button" name="" class="one-button one-main one-button-text-strong one-button-medium" @click="btnXiu"
                    style="margin-left: 12px;"><span>修改</span></button>
          </div>
          <div class="setting-common-card-container-content-item">
            <div class="item-name-zone"><span class="desc-name">地域</span></div>
            <div class="item-value-zone">全部地域</div>
            <button type="button" name="" class="one-button one-main one-button-text-strong one-button-medium"  @click="btnXiu"
                    style="margin-left: 12px;"><span>修改</span></button>
          </div>
          <div class="setting-common-card-container-content-item">
            <div class="item-name-zone"><span class="desc-name">激活时长</span>
              <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" min-width="24" height="24"
                   class="dls-icon brave-the-winds-common-libs-tips-icon" focusable="false">
                <path fill="currentColor"
                      d="M12.054 18.34a1.242 1.242 0 1 0 0-2.484 1.242 1.242 0 0 0 0 2.484zM8.3 9.7a3.7 3.7 0 1 1 5.813 3.038c-.029.021-.064.05-.106.084-.12.1-.28.247-.438.431-.33.385-.569.835-.569 1.307h-2c0-1.148.57-2.048 1.05-2.608a5.739 5.739 0 0 1 .819-.78l-.004-.008a1.82 1.82 0 0 0 .08-.05l.011-.009.072-.052.009-.006A1.69 1.69 0 0 0 13.7 9.7a1.7 1.7 0 1 0-3.4 0h-2z"></path>
                <path fill="currentColor" fill-rule="evenodd"
                      d="M23 12c0 6.075-4.925 11-11 11S1 18.075 1 12 5.925 1 12 1s11 4.925 11 11zm-2 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0z"
                      clip-rule="evenodd"></path>
              </svg>
            </div>
            <div class="item-value-zone">管理员为您提交关键词/创意后：24小时内确认</div>
            <button type="button" name="" class="one-button one-main one-button-text-strong one-button-medium"  @click="btnXiu"
                    style="margin-left: 12px;"><span>修改</span></button>
          </div>
        </div>
      </div>
      <div class="setting-common-card-container ">
        <div class="setting-common-card-container-title">监测链接
          <div class="setting-common-card-container-title-unEdit-tip">
            <div class="account-settings-monitorLink-tip">
              <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" min-width="24" height="24"
                   class="dls-icon account-settings-monitorLink-tip-exclamation" focusable="false">
                <path fill="currentColor" fill-rule="evenodd"
                      d="M14.598 3.298c-1.155-2-4.041-2-5.196 0L1.2 17.5c-1.155 2 .289 4.5 2.598 4.5h16.406c2.31 0 3.753-2.5 2.598-4.5L14.598 3.298zM11 7.4v8h2v-8h-2zm2.25 10.55a1.25 1.25 0 1 1-2.5 0 1.25 1.25 0 0 1 2.5 0z"
                      clip-rule="evenodd"></path>
              </svg>
              开启监测功能前请阅读并签署《
              <button type="button" name="" class="one-button one-main one-button-text-strong one-button-medium"><span>数据安全承诺函</span>
              </button>
              》
            </div>
          </div>
        </div>
        <div class="setting-common-card-container-content horizontal">
          <div class="setting-common-card-container-content-item">
            <div class="item-name-zone"><span class="desc-name">点击监测</span>
              <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" min-width="24" height="24"
                   class="dls-icon brave-the-winds-common-libs-tips-icon" focusable="false">
                <path fill="currentColor"
                      d="M12.054 18.34a1.242 1.242 0 1 0 0-2.484 1.242 1.242 0 0 0 0 2.484zM8.3 9.7a3.7 3.7 0 1 1 5.813 3.038c-.029.021-.064.05-.106.084-.12.1-.28.247-.438.431-.33.385-.569.835-.569 1.307h-2c0-1.148.57-2.048 1.05-2.608a5.739 5.739 0 0 1 .819-.78l-.004-.008a1.82 1.82 0 0 0 .08-.05l.011-.009.072-.052.009-.006A1.69 1.69 0 0 0 13.7 9.7a1.7 1.7 0 1 0-3.4 0h-2z"></path>
                <path fill="currentColor" fill-rule="evenodd"
                      d="M23 12c0 6.075-4.925 11-11 11S1 18.075 1 12 5.925 1 12 1s11 4.925 11 11zm-2 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0z"
                      clip-rule="evenodd"></path>
              </svg>
            </div>
            <div class="account-settings-monitor-long-url">未设置</div>
          </div>
        </div>
      </div>
      <div class="setting-common-card-container ">
        <div class="setting-common-card-container-title">搜索意图地域词
          <button type="button" name="" class="one-button one-main one-button-text-strong one-button-medium" @click="btnXiu"
                  style="margin-left: 12px;"><span>修改</span></button>
        </div>
        <div class="setting-common-card-container-content horizontal">
          <div class="setting-common-card-container-content-item">
            <div class="item-name-zone"><span class="desc-name">扩展</span>
              <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" min-width="24" height="24"
                   class="dls-icon brave-the-winds-common-libs-tips-icon" focusable="false">
                <path fill="currentColor"
                      d="M12.054 18.34a1.242 1.242 0 1 0 0-2.484 1.242 1.242 0 0 0 0 2.484zM8.3 9.7a3.7 3.7 0 1 1 5.813 3.038c-.029.021-.064.05-.106.084-.12.1-.28.247-.438.431-.33.385-.569.835-.569 1.307h-2c0-1.148.57-2.048 1.05-2.608a5.739 5.739 0 0 1 .819-.78l-.004-.008a1.82 1.82 0 0 0 .08-.05l.011-.009.072-.052.009-.006A1.69 1.69 0 0 0 13.7 9.7a1.7 1.7 0 1 0-3.4 0h-2z"></path>
                <path fill="currentColor" fill-rule="evenodd"
                      d="M23 12c0 6.075-4.925 11-11 11S1 18.075 1 12 5.925 1 12 1s11 4.925 11 11zm-2 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0z"
                      clip-rule="evenodd"></path>
              </svg>
            </div>
            <div class="item-value-zone"><span class="geographic-location-item">搜索意图地域扩展已升级为地域设置中的地理位置选项<button
                type="button" name="" class="one-button one-main one-button-text-strong one-button-medium"
                style="vertical-align: middle;"><span>前往查看</span></button></span></div>
          </div>
          <div class="setting-common-card-container-content-item">
            <div class="item-name-zone"><span class="desc-name">排除</span>
              <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" min-width="24" height="24"
                   class="dls-icon brave-the-winds-common-libs-tips-icon" focusable="false">
                <path fill="currentColor"
                      d="M12.054 18.34a1.242 1.242 0 1 0 0-2.484 1.242 1.242 0 0 0 0 2.484zM8.3 9.7a3.7 3.7 0 1 1 5.813 3.038c-.029.021-.064.05-.106.084-.12.1-.28.247-.438.431-.33.385-.569.835-.569 1.307h-2c0-1.148.57-2.048 1.05-2.608a5.739 5.739 0 0 1 .819-.78l-.004-.008a1.82 1.82 0 0 0 .08-.05l.011-.009.072-.052.009-.006A1.69 1.69 0 0 0 13.7 9.7a1.7 1.7 0 1 0-3.4 0h-2z"></path>
                <path fill="currentColor" fill-rule="evenodd"
                      d="M23 12c0 6.075-4.925 11-11 11S1 18.075 1 12 5.925 1 12 1s11 4.925 11 11zm-2 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0z"
                      clip-rule="evenodd"></path>
              </svg>
            </div>
            <div class="item-value-zone">未启用</div>
          </div>
        </div>
      </div>
      <div class="setting-common-card-container ">
        <div class="setting-common-card-container-title">创意组件
          <button type="button" name="" class="one-button one-main one-button-text-strong one-button-medium" @click="btnXiu"
                  style="margin-left: 12px;"><span>修改</span></button>
        </div>
        <div class="setting-common-card-container-content horizontal">
          <div class="setting-common-card-container-content-item">
            <div class="item-name-zone"><span class="desc-name">文字类自动生成</span>
              <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" min-width="24" height="24"
                   class="dls-icon brave-the-winds-common-libs-tips-icon" focusable="false">
                <path fill="currentColor"
                      d="M12.054 18.34a1.242 1.242 0 1 0 0-2.484 1.242 1.242 0 0 0 0 2.484zM8.3 9.7a3.7 3.7 0 1 1 5.813 3.038c-.029.021-.064.05-.106.084-.12.1-.28.247-.438.431-.33.385-.569.835-.569 1.307h-2c0-1.148.57-2.048 1.05-2.608a5.739 5.739 0 0 1 .819-.78l-.004-.008a1.82 1.82 0 0 0 .08-.05l.011-.009.072-.052.009-.006A1.69 1.69 0 0 0 13.7 9.7a1.7 1.7 0 1 0-3.4 0h-2z"></path>
                <path fill="currentColor" fill-rule="evenodd"
                      d="M23 12c0 6.075-4.925 11-11 11S1 18.075 1 12 5.925 1 12 1s11 4.925 11 11zm-2 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0z"
                      clip-rule="evenodd"></path>
              </svg>
            </div>
            <div class="account-setting-display-sublick">
              <div class="sublink-item">监控代码：<span class="card-content-type">系统自动设置</span></div>
              <div class="card-content-content">文字链：</div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import ItemMixins from "./item.mixins";
import * as echarts from 'echarts';
import {getPromotionUnitList} from '@/services/model/managecenter'

export default {
  mixins: [ItemMixins],
  data() {
    return {


      isToggleStatus: false,

      chart: null,
      value: '下载',
      sumTypeList: [{
        value: '消费',
        label: '消费'
      }, {
        value: '展示',
        label: '展示'
      }, {
        value: '点击',
        label: '点击'
      }, {
        value: '平均点击价格',
        label: '平均点击价格'
      }],
      options2: [{
        value: '下载',
        label: '下载'
      }, {
        value: '发送邮箱',
        label: '发送邮箱'
      },
        {
          value: '下载设置',
          label: '下载设置'
        },],
      options: [{
        value: 0,
        label: '合计'
      }, {
        value: 1,
        label: '分时'
      }, {
        value: 2,
        label: '分日'
      }, {
        value: 3,
        label: '分周'
      }, {
        value: 4,
        label: '分月'
      }],
      isSelect: '账户整体',
      activeName: '整体走势',

    };
  },
  methods: {
    async queryList() {
      this.form.createTime = this.formatDate(this.timerArray[0]);
      this.form.updateTime = this.formatDate(this.timerArray[1]);

      let res = await getPromotionUnitList(this.form)
       const modifiedArray = this.replaceNullWithDash( res.rows);
                this.tableList = modifiedArray|| []
       this.form.total = Math.ceil(Number(res.total) );
    },

    handleClick(tab, event) {
      console.log(tab, event);
    }
  },
  mounted() {
    this.queryList()
  },
};
</script>
<style>
.fc-manage-dashboard-container .manage-dashboard-main-container .manage-dashboard-main-workspace .manage-dashboard-main-workspace-content {
  position: relative;
  width: calc(100% - 134px);
  margin-left: 24px;
  border-radius: 6px;
}
.setting-common-card-container {
  position: relative;
  width: 100%;
  background: #fff;
  border-radius: 4px;
  margin-bottom: 20px;
  padding: 24px 24px 0;
  box-sizing: border-box;
}
.setting-common-card-container-title {
  display: flex;
  align-items: center;
  font-size: 16px;
  color: #282c33;
}
.setting-common-card-container-content {
  display: flex;
  margin-top: 16px;
  flex-wrap: wrap;
}
.setting-common-card-container-content-item {
  display: flex;
  margin-bottom: 24px;
  min-width: 400px;
  align-items: center;  height: auto;

}.brave-the-winds-common-libs-tips-icon {
   margin-left: 4px;
   color: #848b99;
   font-size: 14px;
 }.dls-icon {
     display: inline-block;
     width: auto;
     height: 1em;
     fill: currentColor;
   }
.setting-common-card-container-content-item .item-name-zone {
  text-align: right;
  width: 120px;
  position: relative;
  height: auto;

}
.setting-common-card-container-content-item .item-value-zone {
  font-size: 14px;
  color: #282c33;
  font-weight: 400;
  max-width: 210px;
  margin-left: 30px;
  text-overflow: ellipsis;
  display: inline-block;

  -webkit-box-orient: vertical;  height: auto;

}
.account-settings-accountinfo-status-warning {
  color: #ff9100;
}
.one-button-text-strong {
  padding: 0;
  color: #0054e6;
  background-color: transparent;
  line-height: inherit;
}
.setting-common-card-container-title-unEdit-tip {
  margin-left: 28px;
  font-size: 14px;
  color: #282c33;
}
.account-settings-monitorLink-tip {
  display: flex;
  align-items: center;
}
.account-settings-monitorLink-tip-exclamation {
  color: #ff9100;
  margin-right: 4px;
}.setting-common-card-container-content-item .item-name-zone {
   text-align: right;
   width: 120px;
   position: relative;
 }.account-settings-monitor-long-url {
    font-size: 14px;
    color: #282c33;
    font-weight: 400;
    max-width: 700px;
    margin-left: 30px;
    text-overflow: ellipsis;
    display: inline-block;
  }
.dls-icon {
  display: inline-block;
  width: auto;
  height: 1em;
  fill: currentColor;
  vertical-align: -0.125em;
}.setting-common-card-container-content-item .geographic-location-item {
   width: auto;
   padding-left: 0;
  line-height:1.5em ;
 }
.geographic-location-item {
  display: inline-block;
  width: 222px;
  padding-left: 32px;
  font-size: 14px;
  color: #282c33;
}.setting-common-card-container-content-item {
   display: flex;
   margin-bottom: 24px;
   min-width: 400px;
   align-items: center;
 }.setting-common-card-container-content-item .item-name-zone {
    text-align: right;
    width: 120px;
    position: relative;
  }
.setting-common-card-container-content-item .desc-name {
  font-size: 14px;
  color: #282c33;
  font-weight: 400;
}
.account-settings .account-setting-display-sublick {
  margin-left: 30px;
  font-size: 14px;
  font-weight: 400;
  color: #282c33;
}
.account-settings .account-setting-display-sublick .sublink-item {
  margin-bottom: 24px;
}
</style>
